<template>
  <div class="rights">
    <div class="breadcrumb-wrap">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>权限管理</el-breadcrumb-item>
        <el-breadcrumb-item>权限列表</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <el-table
    :data="rightsLists"
    border
    max-height="480"
    style="width: 100%">
    <el-table-column
      type="index"
      width="50">
    </el-table-column>
    <el-table-column
      prop="authName"
      label="权限名称"
      width="180">
    </el-table-column>
    <el-table-column
      prop="path"
      label="路径"
      width="180">
    </el-table-column>
    <el-table-column
      prop="level"
      label="层级">
      <template slot-scope="scope">
          <span v-if="scope.row.level == 0">一级</span>
          <span v-else-if="scope.row.level == 1"> 二级</span>
          <span v-else>三级</span>
      </template>
    </el-table-column>
  </el-table>
  </div>
</template>

<script>
import {getRights} from '@/http/api'
export default {
    data() {
        return {
            rightsLists: []
        }
    },
    methods: {
        getRights() {
            getRights(true).then(res => {
                this.rightsLists = res.data
            })
        }
    },
    created() {
        this.getRights()
    }
};
</script>
<style>
</style>